<link rel="stylesheet" href="/css/snaker.css" type="text/css" media="all" />


<script src="/js/jquery-ui-1.10.2.custom.min.js" type="text/javascript"></script>
<script src="/js/raphael-min.js" type="text/javascript"></script>
<script src="/js/snaker/dialog.js" type="text/javascript"></script>
<script src="/js/snaker/snaker.designer.js"	type="text/javascript"></script>
<script src="/js/snaker/snaker.model.js" type="text/javascript"></script>
<script src="/js/snaker/snaker.editors.js" type="text/javascript"></script>

<div class="layui-side layui-bg-black">
	<div class="layui-side-scroll">
		<#include "/apps/business/workorders/include/left.html">
	</div>
</div>
<div class="layui-body">
	<div class="layui-side-scroll">
		<div class="row">
			<div class="col-lg-12">
				<h1 class="site-h1" style="background-color:#FFFFFF;">
					流程列表<#if processList??>（${processList.totalElements!''}）</#if>
					<span style="float:right;">
						<button class="layui-btn layui-btn-sm green" href="/apps/bpm/add.html" data-toggle="ajax" data-width="550" data-height="300" data-title="创建新网站">
							创建新流程
						</button>
					</span>
				</h1>
				<div class="row" style="padding:5px;">
					<div class="col-lg-12" style="position: relative;">
						<div id="toolbox">
							<div id="toolbox_handle">工具集</div>
							<div class="node" id="save">
								<img src="/js/snaker/images/save.gif" />&nbsp;&nbsp;保存
							</div>
							<div>
								<hr />
							</div>
							<div class="node selectable" id="pointer">
								<img src="/js/snaker/images/select16.gif" />&nbsp;&nbsp;选择
							</div>
							<div class="node selectable" id="path">
								<img src="/js/snaker/images/16/flow_sequence.png" />&nbsp;&nbsp;连接
							</div>
							<div>
								<hr />
							</div>
							<div class="node state" id="start" type="start">
								<img src="/js/snaker/images/16/start_event_empty.png" />&nbsp;&nbsp;开始
							</div>
							<div class="node state" id="end" type="end">
								<img src="/js/snaker/images/16/end_event_terminate.png" />&nbsp;&nbsp;结束
							</div>
							<div class="node state" id="task" type="task">
								<img src="/js/snaker/images/16/task_empty.png" />&nbsp;&nbsp;任务
							</div>
							<div class="node state" id="fork" type="decision">
								<img src="/js/snaker/images/16/gateway_exclusive.png" />&nbsp;&nbsp;判断
							</div>
							<div class="node state" id="fork" type="fork">
								<img src="/js/snaker/images/16/gateway_parallel.png" />&nbsp;&nbsp;分支
							</div>
							<div class="node state" id="join" type="join">
								<img src="/js/snaker/images/16/gateway_parallel.png" />&nbsp;&nbsp;汇合
							</div>
						</div>

						<div id="properties">
							<div id="properties_handle">属性</div>
							<table class="properties_all" cellpadding="0" cellspacing="0">
							</table>
							<div>&nbsp;</div>
						</div>

						<div id="snakerflow"></div>
					</div> 	   
				</div>
			</div>	
		</div>
	</div>
</div>
<script type="text/javascript">
	$(function() {
		var json="${(processcontent!'')?no_esc}";
		var model = "";
		if(json) {
			model=eval("(" + json + ")");
		}
		$('#snakerflow').snakerflow({
			basePath : "/js/snaker/",
    		ctxPath : "",
			restore : model,
    		formPath : "forms/",
			tools : {
				save : {
					onclick : function(data) {
						saveModel(data);
					}
				}
			}
		});
	});
	
	function saveModel(data) {
		$.ajax({
			type:'POST',
			url:"/apps/bpm/design/save.html",
			data:"content=" + encodeURIComponent(data) + "&id=${processContent.id!''}",
			async: false,
			globle:false,
			error: function(){
				alert('数据处理错误！');
				return false;
			},
			success: function(data){
				top.layer.alert('保存成功', {icon: 1});
			}
		});
	}
</script>				